<template>
  <div class="home">    
    <div class="fixed-div" @click="toggleFixedDiv">
      Feedback
    </div>
    <div class="home-top">
      <Header></Header>
    </div>
    <div class="home-body">
        <router-view></router-view>
    </div>
    <!-- <div class="home-feet"></div> -->
    <feet></feet>
  </div>
</template>

<script setup>
import Header from '../home/header.vue'
import feet from '../../components/modules/feet.vue'
</script>
<style scoped>
  .fixed-div {
    border-top-left-radius:4px ;
    border-bottom-left-radius: 4px;
    position: fixed;
    writing-mode: tb-rl;
    /* letter-spacing: 5px; */
    bottom: 350px;
    right: 0px;
    padding: 3px;
    width: 30px;
    height: 99px;
    color: #ffffff;
    font-size: 14px;
    line-height: 30px;
    text-align: center;
    font-weight: normal !important;
    background-color: #f0f0f0;
    z-index: 1000;
    cursor: pointer;
    background-color: #333366;
}
.home{
  /* position: absolute; */
  width: 100%;
  height: 100%;
  min-width: 1170px;
  /* background-color: rgba(0, 255, 255, 0.397); */
  display: flex;
  flex-direction: column;
}
.home-top{
  width: 100%;
  height: 70px;
  /* position: fixed;
  z-index: 2; */
  /* background-color: yellowgreen; */
}
.home-body{
  /* position: absolute; */
  width: 100%;
  /* height: 91%; */
  overflow-wrap: break-word;
  margin-top: 2%;
  min-width: 1170px;
  /* z-index: 1; */
  /* background-color: rgba(197, 33, 33, 0.603); */
}
.home-feet{
  /* position: absolute; */
  width: 100%;
  height: 100px;
  /* top:91%; */
  /* margin-top:91%; */
  background-color: #333366;
}
</style>